import * as GUI from 'babylonjs-gui'
import Base from "../Base";
import type { AbstractMesh, IMouseEvent, Nullable } from "babylonjs";
import type { Rectangle, StackPanel, Button } from "babylonjs-gui";
import { useAgvApi } from "../../api/agv";


import { useEscapeApi } from "../../api/escape";
import { EE } from '../../event';
import { Local } from '../../utils/storage';
import initMap from '../../map/init';
import { ElMessage } from 'element-plus';


export default class Gui {
    private base: Base
    private navPanel: StackPanel | null
    private panelInfo: TBatteryPanel
    private headBtns: THeaderBtns
    private pathNavFlag: boolean = false
    private taskNavFlag: boolean = false

    constructor() {
        this.base = Base.getInstance()
        // this.createCameraToggleButton()
        this.headBtns = this.createAgvHeaderBtn()
        this.navPanel = null
        this.panelInfo = this.createInfoPanel()
        this.registerInfoPanelEvent()
        this.registerNavigateMenu()
    }



    // private createCameraToggleButton() {
    //     // GUI
    //     const advancedTexture = GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
    //     // 创建一个容器
    //     const panel = new GUI.Rectangle();
    //     panel.width = "85px";
    //     panel.height = "75px";
    //     panel.cornerRadius = 3;
    //     panel.color = "Green";
    //     panel.thickness = 1;
    //     panel.background = "rgba(255,255,255,0.8)";
    //     advancedTexture.addControl(panel);
    //     // button 1----------------------------------------------------------------
    //     const button = GUI.Button.CreateSimpleButton("AGV1", "AGV1");
    //     button.width = "50px";
    //     button.height = "20px";
    //     button.color = "white";
    //     button.fontSize = "15px"
    //     button.background = "green";

    //     // 调整按钮的位置
    //     button.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //     button.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP

    //     button.onPointerUpObservable.add(() => {
    //         this.base.toggleCamera("agv1")
    //     });

    //     panel.addControl(button)

    //     // button 2----------------------------------------------------------------
    //     const button2 = GUI.Button.CreateSimpleButton("AGV2", "AGV2");
    //     button2.width = "50px";
    //     button2.height = "20px";
    //     button2.color = "white";
    //     button2.fontSize = "15px"
    //     button2.background = "green";

    //     // 调整按钮的位置
    //     button2.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //     button2.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP

    //     button2.top = '20px'

    //     button2.onPointerUpObservable.add(() => {
    //         this.base.toggleCamera("agv2")
    //     });

    //     panel.addControl(button2);
    // }


    private createAgvHeaderBtn() {
        // 创建一个全屏的用户界面
        const advancedTexture = GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
        // 创建一个堆叠面板
        const panel = new GUI.StackPanel();
        panel.width = "100%"
        panel.height = "32px"
        panel.background = "rgba(255,255,255,0.8)";
        panel.isVertical = false
        panel.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT
        panel.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP
        advancedTexture.addControl(panel);

        // 3D button
        const threeDbtn = GUI.Button.CreateSimpleButton("threeBtn", "3D视图");
        threeDbtn.fontSize = '12px'
        threeDbtn.width = "60px";
        threeDbtn.height = "30px";
        threeDbtn.color = "white";
        threeDbtn.cornerRadius = 20;
        threeDbtn.background = "#409eff";
        threeDbtn.onPointerUpObservable.add(() => {
            this.base.toggleCamera('agv1')
        });
        panel.addControl(threeDbtn);


        //点云button 
        const radarPointBtn = GUI.Button.CreateSimpleButton("radarPointBtn", "显示点云");
        radarPointBtn.fontSize = '12px'
        radarPointBtn.width = "60px";
        radarPointBtn.height = "30px";
        radarPointBtn.color = "white";
        radarPointBtn.cornerRadius = 20;
        radarPointBtn.background = "#409eff";
        radarPointBtn.onPointerUpObservable.add(() => {
            this.base.ground.togglePoints()
        });
        panel.addControl(radarPointBtn);


        //路径导航 button 
        const pathNavBtn = GUI.Button.CreateSimpleButton("pathNavBtn", "路径导航");
        pathNavBtn.fontSize = '12px'
        pathNavBtn.width = "60px";
        pathNavBtn.height = "30px";
        pathNavBtn.color = "white";
        pathNavBtn.cornerRadius = 20;
        pathNavBtn.background = "#409eff";
        pathNavBtn.disabledColor = '#9fceff'
        pathNavBtn.onPointerUpObservable.add(() => {
            EE.emit('pathNav')
            // 禁用当前按钮
            pathNavBtn.isEnabled = false
        });
        panel.addControl(pathNavBtn);


        // 创建第二个按钮并添加到面板中
        const pauseNavBtn = GUI.Button.CreateSimpleButton("pauseNavBtn", "暂停导航");
        pauseNavBtn.fontSize = '12px'
        pauseNavBtn.width = "60px";
        pauseNavBtn.height = "30px";
        pauseNavBtn.color = "white";
        pauseNavBtn.cornerRadius = 20;
        pauseNavBtn.background = "#409eff";
        pauseNavBtn.disabledColor = '#9fceff'
        pauseNavBtn.isEnabled = false

        pauseNavBtn.onPointerUpObservable.add(async () => {
            await useAgvApi().runNav({ m_type: 3001 });
        });

        panel.addControl(pauseNavBtn);


        const resumeNavBtn = GUI.Button.CreateSimpleButton("resumeNavBtn", "继续导航");
        resumeNavBtn.fontSize = '12px'
        resumeNavBtn.width = "60px";
        resumeNavBtn.height = "30px";
        resumeNavBtn.color = "white";
        resumeNavBtn.cornerRadius = 20;
        resumeNavBtn.background = "#409eff";
        resumeNavBtn.disabledColor = '#9fceff'
        resumeNavBtn.isEnabled = false
        resumeNavBtn.onPointerUpObservable.add(async () => {
            await useAgvApi().runNav({ m_type: 3002 });
        });
        panel.addControl(resumeNavBtn);


        const cancelNavBtn = GUI.Button.CreateSimpleButton("cancelNavBtn", "取消导航");
        cancelNavBtn.fontSize = '12px'
        cancelNavBtn.width = "60px";
        cancelNavBtn.height = "30px";
        cancelNavBtn.color = "white";
        cancelNavBtn.cornerRadius = 20;
        cancelNavBtn.background = "#409eff";

        cancelNavBtn.disabledColor = '#9fceff'
        cancelNavBtn.isEnabled = false
        cancelNavBtn.onPointerUpObservable.add(async () => {
            await useAgvApi().runNav({ m_type: 3003 });
        });
        panel.addControl(cancelNavBtn);



        const taskNavBtn = GUI.Button.CreateSimpleButton("taskNavBtn", "任务导航");
        taskNavBtn.fontSize = '12px'
        taskNavBtn.width = "60px";
        taskNavBtn.height = "30px";
        taskNavBtn.color = "white";
        taskNavBtn.cornerRadius = 20;
        taskNavBtn.background = "#409eff";
        taskNavBtn.disabledColor = '#9fceff'

        taskNavBtn.onPointerUpObservable.add(() => {
            EE.emit("toggleTaskNavPanel")
            this.taskNavFlag = true
        });

        panel.addControl(taskNavBtn);



        const pauseTaskNavBtn = GUI.Button.CreateSimpleButton("pauseTaskNavBtn", "暂停任务");
        pauseTaskNavBtn.fontSize = '12px'
        pauseTaskNavBtn.width = "60px";
        pauseTaskNavBtn.height = "30px";
        pauseTaskNavBtn.color = "white";
        pauseTaskNavBtn.cornerRadius = 20;
        pauseTaskNavBtn.background = "#409eff";
        pauseTaskNavBtn.disabledColor = '#9fceff'
        pauseTaskNavBtn.isEnabled = false
        pauseTaskNavBtn.onPointerUpObservable.add(() => {
            alert('取消导航')
        });
        panel.addControl(pauseTaskNavBtn);



        const resumeTaskNavBtn = GUI.Button.CreateSimpleButton("resumeTaskNavBtn", "继续任务");
        resumeTaskNavBtn.fontSize = '12px'
        resumeTaskNavBtn.width = "60px";
        resumeTaskNavBtn.height = "30px";
        resumeTaskNavBtn.color = "white";
        resumeTaskNavBtn.cornerRadius = 20;
        resumeTaskNavBtn.background = "#409eff";
        resumeTaskNavBtn.disabledColor = '#9fceff'
        resumeTaskNavBtn.isEnabled = false
        resumeTaskNavBtn.onPointerUpObservable.add(() => {
            alert('取消导航')
        });
        panel.addControl(resumeTaskNavBtn);



        const cancelTaskNavBtn = GUI.Button.CreateSimpleButton("cancelTaskNavBtn", "取消任务");
        cancelTaskNavBtn.fontSize = '12px'
        cancelTaskNavBtn.width = "60px";
        cancelTaskNavBtn.height = "30px";
        cancelTaskNavBtn.color = "white";
        cancelTaskNavBtn.cornerRadius = 20;
        cancelTaskNavBtn.background = "#409eff";
        cancelTaskNavBtn.disabledColor = '#9fceff'
        cancelTaskNavBtn.isEnabled = false
        cancelTaskNavBtn.onPointerUpObservable.add(() => {
            alert('取消导航')
        });
        panel.addControl(cancelTaskNavBtn);


        const refreshMapBtn = GUI.Button.CreateSimpleButton("refreshMapBtn", "刷新地图");
        refreshMapBtn.fontSize = '12px'
        refreshMapBtn.width = "60px";
        refreshMapBtn.height = "30px";
        refreshMapBtn.color = "white";
        refreshMapBtn.cornerRadius = 20;
        refreshMapBtn.background = "#409eff";
        refreshMapBtn.disabledColor = '#9fceff'
        refreshMapBtn.onPointerUpObservable.add(async () => {
            Local.remove('tt15_map');
            await initMap(true)
            window.location.reload()
        });
        panel.addControl(refreshMapBtn);

        const toChargeBtn = GUI.Button.CreateSimpleButton("toChargeBtn", "去充电");
        toChargeBtn.fontSize = '12px'
        toChargeBtn.width = "60px";
        toChargeBtn.height = "30px";
        toChargeBtn.color = "white";
        toChargeBtn.cornerRadius = 20;
        toChargeBtn.background = "#409eff";
        toChargeBtn.disabledColor = '#9fceff'
        toChargeBtn.onPointerUpObservable.add(() => {
            alert('取消导航')
        });
        panel.addControl(toChargeBtn);


        const seizeControlBtn = GUI.Button.CreateSimpleButton("seizeControlBtn", "抢占控制权");
        seizeControlBtn.fontSize = '12px'
        seizeControlBtn.width = "80px";
        seizeControlBtn.height = "30px";
        seizeControlBtn.color = "white";
        seizeControlBtn.cornerRadius = 20;
        seizeControlBtn.background = "#409eff";
        seizeControlBtn.disabledColor = '#9fceff'
        seizeControlBtn.textBlock!.textHorizontalAlignment = BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        seizeControlBtn.textBlock!.paddingLeft = 10


        seizeControlBtn.onPointerUpObservable.add(async () => {
            await useAgvApi().runConfig({
                m_type: 4005,
                m_data: {
                    nick_name: 'AI',
                },
            });
        });
        panel.addControl(seizeControlBtn);

        return {
            threeDbtn,
            radarPointBtn,
            pathNavBtn,
            pauseNavBtn,
            resumeNavBtn,
            cancelNavBtn,
            taskNavBtn,
            resumeTaskNavBtn,
            pauseTaskNavBtn,
            cancelTaskNavBtn,
            refreshMapBtn,
            toChargeBtn,
            seizeControlBtn
        }


    }

    private registerNavigateMenu() {
        EE.on('pathNav', () => {
            if (this.pathNavFlag) {
                this.pathNavFlag = false
                document.body.style.cursor = "";
            } else {
                this.pathNavFlag = true
                document.body.style.cursor = "crosshair";
            }
        })
    }

    public registerTaskNavEvent(station: Nullable<AbstractMesh> | undefined) {
        if (!this.taskNavFlag) return
        EE.emit('addTaskNavStation', station?.id)

        // 关闭任务导航的标志位
        EE.on("toggleTaskNavPanel", () => {
            this.taskNavFlag = false
        })
    }



    public createPathNavMenu(station: Nullable<AbstractMesh> | undefined, event: IMouseEvent) {
        //  
        if (!this.pathNavFlag) return
        // 检查是否已经点了一个坐标点
        if (this.navPanel !== null) return
        // GUI
        // 创建一个全屏的用户界面
        const advancedTexture = GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
        // 创建一个堆叠面板
        const panel = new GUI.StackPanel();
        panel.width = "120px"
        panel.height = "40px"
        // panel.background = "#409eff";
        panel.isVertical = true
        panel.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT
        panel.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP
        panel.top = event.clientY - 21 + "px"
        panel.left = event.clientX + 17 + "px"
        this.navPanel = panel
        advancedTexture.addControl(panel);



        const navButton = GUI.Button.CreateSimpleButton("nav", "导航到" + station?.name);
        navButton.width = '100px';
        navButton.height = "20px";
        navButton.color = "white";

        navButton.fontSize = "15px"
        navButton.background = "#409eff";
        navButton.cornerRadius = 20;
        panel.addControl(navButton);
        //  确定导航按钮的事件
        navButton.onPointerUpObservable.add(async () => {
            // 尽管后端可能有延迟,但是还要清除菜单
            panel.dispose()
            this.navPanel = null
            // 路径导航的标志位
            this.pathNavFlag = false
            // 恢复的鼠标的样式
            document.body.style.cursor = ''
            // 重新启动路径导航按钮  
            this.headBtns.pathNavBtn.isEnabled = true


            // 发送导航请求给后端
            try {
                await useAgvApi().runNav({
                    m_type: 3051,
                    m_data: {
                        id: station?.name,
                    },
                });
                ElMessage({
                    message: '导航成功',
                    type: 'success',
                })
            } catch {
                ElMessage({
                    message: '导航失败',
                    type: 'error',
                })
            } finally {
                ElMessage({
                    message: '网络超时',
                    type: 'warning',
                })

            }


        });


        const cancelButton = GUI.Button.CreateSimpleButton("cancel", "取消");
        cancelButton.width = '100px';
        cancelButton.height = "20px";
        cancelButton.color = "white";
        cancelButton.fontSize = "15px"
        cancelButton.background = "#409eff";
        cancelButton.cornerRadius = 20;
        panel.addControl(cancelButton);

        // 取消按钮的事件
        cancelButton.onPointerUpObservable.add(() => {
            panel.dispose()
            this.navPanel = null
            this.pathNavFlag = false
            // 恢复的鼠标的样式
            document.body.style.cursor = ''
            // 重新启动路径导航按钮  
            this.headBtns.pathNavBtn.isEnabled = true
        });

    }

    public setHeaderBtnStatus(task_status: number) {
        // console.log(task_status);
        // 0 = NONE, 
        // 1 = WAITING(目前不可能出现该状态), 
        // 2 = RUNNING, 
        // 3 = SUSPENDED, 
        // 4 = COMPLETED, 5 = FAILED, 6 = CANCELED


        if (task_status === 2) {
            // 动态设置按钮的状态
            (this.headBtns.pathNavBtn as Button).isEnabled = false;// 禁用按钮
            (this.headBtns.pauseNavBtn as Button).isEnabled = true;// 启用按钮
            (this.headBtns.resumeNavBtn as Button).isEnabled = false;// 禁用按钮
            (this.headBtns.cancelNavBtn as Button).isEnabled = true;// 启用按钮
            (this.headBtns.taskNavBtn as Button).isEnabled = false;// 禁用按钮

        } else if (task_status === 4) {
            (this.headBtns.pathNavBtn as Button).isEnabled = true;// 启用按钮
            (this.headBtns.pauseNavBtn as Button).isEnabled = false;// 启用按钮
            (this.headBtns.cancelNavBtn as Button).isEnabled = false;
            (this.headBtns.taskNavBtn as Button).isEnabled = true;
        } else if (task_status === 3) {
            (this.headBtns.resumeNavBtn as Button).isEnabled = true;
        }


    }
    // private createInfoPanel() {
    //         const advancedTexture = GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");

    //         // 创建一个容器
    //         const panel = new GUI.Rectangle();
    //         panel.width = "120px";
    //         panel.height = "400px";
    //         panel.cornerRadius = 3;
    //         // panel.color = "Green";
    //         panel.thickness = 0;
    //         panel.background = "#ffffff00";
    //         panel.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         panel.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         panel.top = 32 + "px"
    //         panel.left = 0 + "px"
    //         advancedTexture.addControl(panel);

    //         // batteryCycle  --------------------------------------------------------------
    //         const batteryCycle = new GUI.TextBlock();
    //         // position
    //         batteryCycle.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         batteryCycle.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         // content
    //         batteryCycle.text = "电池循环:0"
    //         batteryCycle.fontSize = "11px";
    //         batteryCycle.color = '#ffffff'
    //         batteryCycle.fontWeight = "bold"

    //         batteryCycle.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         batteryCycle.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         panel.addControl(batteryCycle);

    //         // batteryLevel
    //         const batteryLevel = new GUI.TextBlock();
    //         batteryLevel.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         batteryLevel.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         batteryLevel.top = 15
    //         batteryLevel.text = "电池电量:0%"
    //         batteryLevel.fontSize = "11px";
    //         batteryLevel.color = '#ffffff'
    //         batteryLevel.fontWeight = "bold"
    //         panel.addControl(batteryLevel);


    //         // batter temp------------------------------------------------------------------------
    //         const batteryTemp = new GUI.TextBlock();
    //         // position
    //         batteryTemp.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         batteryTemp.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         batteryTemp.top = 30
    //         // content
    //         batteryTemp.text = "电池温度:0℃"
    //         batteryTemp.fontSize = "11px";
    //         batteryTemp.color = '#ffffff'
    //         batteryTemp.fontWeight = "bold"
    //         panel.addControl(batteryTemp);


    //         // "controller_humi": 15.419,
    //         const controllerHumi = new GUI.TextBlock();
    //         controllerHumi.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         controllerHumi.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         controllerHumi.top = 45
    //         controllerHumi.text = "控制器湿度:0%"
    //         controllerHumi.fontSize = "11px";
    //         controllerHumi.color = '#ffffff'
    //         controllerHumi.fontWeight = "bold"
    //         panel.addControl(controllerHumi);

    //         // "controllerTemp": 50.297,
    //         const controllerTemp = new GUI.TextBlock();
    //         controllerTemp.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         controllerTemp.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         controllerTemp.top = 60
    //         controllerTemp.text = "控制器温度:0℃"
    //         controllerTemp.fontSize = "11px";
    //         controllerTemp.color = '#ffffff'
    //         controllerTemp.fontWeight = "bold"
    //         panel.addControl(controllerTemp);

    //         // "controllerVoltage": 24.0,
    //         const controllerVoltage = new GUI.TextBlock();
    //         controllerVoltage.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         controllerVoltage.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         controllerVoltage.top = 75
    //         controllerVoltage.text = "控制器电压:0V"
    //         controllerVoltage.fontSize = "11px";
    //         controllerVoltage.color = '#ffffff'
    //         controllerVoltage.fontWeight = "bold"
    //         panel.addControl(controllerVoltage);


    //         const todayOdo = new GUI.TextBlock();
    //         // position
    //         todayOdo.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         todayOdo.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         todayOdo.top = 90
    //         // content
    //         todayOdo.text = "今日里程:0km"
    //         todayOdo.fontSize = "11px";
    //         todayOdo.color = '#ffffff'
    //         todayOdo.fontWeight = "bold"
    //         panel.addControl(todayOdo);

    //         const odo = new GUI.TextBlock();
    //         // position
    //         odo.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         odo.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         odo.top = 105
    //         // content
    //         odo.text = "累计里程:0km"
    //         odo.fontSize = "11px";
    //         odo.color = '#ffffff'
    //         odo.fontWeight = "bold"
    //         panel.addControl(odo);

    //         const time = new GUI.TextBlock();
    //         // position
    //         time.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         time.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         time.top = 120
    //         // content
    //         time.text = "运行时间:0h"
    //         time.fontSize = "11px";
    //         time.color = '#ffffff'
    //         time.fontWeight = "bold"
    //         panel.addControl(time);

    //         const totalTime = new GUI.TextBlock();
    //         // position
    //         totalTime.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         totalTime.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         totalTime.top = 135
    //         // content
    //         totalTime.text = "累计时间:0h"
    //         totalTime.fontSize = "11px";
    //         totalTime.color = '#ffffff'
    //         totalTime.fontWeight = "bold"
    //         panel.addControl(totalTime);

    //         const voltage = new GUI.TextBlock();
    //         voltage.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         voltage.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         voltage.top = 150
    //         voltage.text = "电池电压:0V"
    //         voltage.fontSize = "11px";
    //         voltage.color = '#ffffff'
    //         voltage.fontWeight = "bold"
    //         panel.addControl(voltage);

    //         const current = new GUI.TextBlock();
    //         current.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         current.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         current.top = 165
    //         current.text = "电池电流:0A"
    //         current.fontSize = "11px";
    //         current.color = '#ffffff'
    //         current.fontWeight = "bold"
    //         panel.addControl(current);


    //         const confidence = new GUI.TextBlock();
    //         confidence.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         confidence.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         confidence.top = 180
    //         confidence.text = "置信度:0"
    //         confidence.fontSize = "11px";
    //         confidence.color = '#ffffff'
    //         confidence.fontWeight = "bold"
    //         panel.addControl(confidence);

    //         const emergency = new GUI.TextBlock();
    //         emergency.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         emergency.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         emergency.top = 195
    //         emergency.text = "EMO状态:关闭"
    //         emergency.fontSize = "11px";
    //         emergency.color = '#ffffff'
    //         emergency.fontWeight = "bold"
    //         panel.addControl(emergency);

    //         const blocked = new GUI.TextBlock();
    //         blocked.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         blocked.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         blocked.top = 210
    //         blocked.text = "阻挡状态:否"
    //         blocked.fontSize = "11px";
    //         blocked.color = '#ffffff'
    //         blocked.fontWeight = "bold"
    //         panel.addControl(blocked);

    //         const diStatus = new GUI.TextBlock();
    //         diStatus.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         diStatus.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         diStatus.top = 230
    //         diStatus.text = `DI:\n🔴🔴🔴🔴🔴\n🔴🔴🔴🔴`
    //         diStatus.fontSize = "11px";
    //         diStatus.color = '#ffffff'
    //         diStatus.fontWeight = "bold"
    //         panel.addControl(diStatus);

    //         const doStatus = new GUI.TextBlock();
    //         doStatus.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         doStatus.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         doStatus.top = 270
    //         doStatus.text = `DO:\n🔴🔴🔴🔴🔴\n🔴🔴🔴🔴🔴`
    //         doStatus.fontSize = "11px";
    //         doStatus.color = '#ffffff'
    //         doStatus.fontWeight = "bold"
    //         panel.addControl(doStatus);

    //         const taskStatus = new GUI.TextBlock();
    //         taskStatus.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         taskStatus.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         taskStatus.top = 315
    //         taskStatus.text = `任务状态:NONE`
    //         taskStatus.fontSize = "11px";
    //         taskStatus.color = '#ffffff'
    //         taskStatus.fontWeight = "bold"
    //         panel.addControl(taskStatus);

    //         const taskType = new GUI.TextBlock();
    //         taskType.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         taskType.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         taskType.top = 330
    //         taskType.text = `导航类型:没有导航`
    //         taskType.fontSize = "11px";
    //         taskType.color = '#ffffff'
    //         taskType.fontWeight = "bold"
    //         panel.addControl(taskType);

    //         const currentLock = new GUI.TextBlock();
    //         currentLock.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
    //         currentLock.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
    //         currentLock.top = 345
    //         currentLock.text = `控制权:\n\t控制者:unknown\n\t锁定IP:0.0.0.0`;
    //         currentLock.fontSize = "11px";
    //         currentLock.color = '#ffffff'
    //         currentLock.fontWeight = "bold"
    //         panel.addControl(currentLock);
    //         // 默认将panel设置不可见,后面在修改
    //         panel.isVisible = true

    //         return {
    //             panel,
    //             batteryCycle,
    //             batteryTemp,
    //             controllerTemp,
    //             controllerHumi,
    //             controllerVoltage,
    //             todayOdo,
    //             odo,
    //             time,
    //             totalTime,
    //             voltage,
    //             current,
    //             confidence,
    //             emergency,
    //             blocked,
    //             diStatus,
    //             doStatus,
    //             taskStatus,
    //             taskType,
    //             currentLock
    //         }


    //     }

    private createInfoPanel() {
        const advancedTexture = GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");

        // 创建一个容器
        const panel = new GUI.Rectangle();
        panel.width = "120px";
        panel.height = "400px";
        panel.cornerRadius = 3;
        // panel.color = "Green";
        panel.thickness = 0;
        panel.background = "#ffffff00";
        panel.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        panel.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        panel.top = 40 + "px"
        panel.left = 0 + "px"
        advancedTexture.addControl(panel);

        // batteryCycle  --------------------------------------------------------------
        const batteryCycle = new GUI.TextBlock();
        // position
        batteryCycle.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        batteryCycle.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        // content
        batteryCycle.text = "电池循环:0"
        batteryCycle.fontSize = "11px";
        batteryCycle.color = '#ffffff'
        batteryCycle.fontWeight = "bold"

        batteryCycle.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        batteryCycle.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        panel.addControl(batteryCycle);

        // batteryLevel
        const batteryLevel = new GUI.TextBlock();
        batteryLevel.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        batteryLevel.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        batteryLevel.top = 15
        batteryLevel.text = "电池电量:0%"
        batteryLevel.fontSize = "11px";
        batteryLevel.color = '#ffffff'
        batteryLevel.fontWeight = "bold"
        panel.addControl(batteryLevel);


        // batter temp------------------------------------------------------------------------
        const batteryTemp = new GUI.TextBlock();
        // position
        batteryTemp.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        batteryTemp.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        batteryTemp.top = 30
        // content
        batteryTemp.text = "电池温度:0℃"
        batteryTemp.fontSize = "11px";
        batteryTemp.color = '#ffffff'
        batteryTemp.fontWeight = "bold"
        panel.addControl(batteryTemp);


        // "controller_humi": 15.419,
        const controllerHumi = new GUI.TextBlock();
        controllerHumi.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        controllerHumi.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        controllerHumi.top = 45
        controllerHumi.text = "控制器湿度:0%"
        controllerHumi.fontSize = "11px";
        controllerHumi.color = '#ffffff'
        controllerHumi.fontWeight = "bold"
        panel.addControl(controllerHumi);

        // "controllerTemp": 50.297,
        const controllerTemp = new GUI.TextBlock();
        controllerTemp.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        controllerTemp.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        controllerTemp.top = 60
        controllerTemp.text = "控制器温度:0℃"
        controllerTemp.fontSize = "11px";
        controllerTemp.color = '#ffffff'
        controllerTemp.fontWeight = "bold"
        panel.addControl(controllerTemp);

        // "controllerVoltage": 24.0,
        const controllerVoltage = new GUI.TextBlock();
        controllerVoltage.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        controllerVoltage.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        controllerVoltage.top = 75
        controllerVoltage.text = "控制器电压:0V"
        controllerVoltage.fontSize = "11px";
        controllerVoltage.color = '#ffffff'
        controllerVoltage.fontWeight = "bold"
        panel.addControl(controllerVoltage);


        const todayOdo = new GUI.TextBlock();
        // position
        todayOdo.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        todayOdo.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        todayOdo.top = 90
        // content
        todayOdo.text = "今日里程:0km"
        todayOdo.fontSize = "11px";
        todayOdo.color = '#ffffff'
        todayOdo.fontWeight = "bold"
        panel.addControl(todayOdo);

        const odo = new GUI.TextBlock();
        // position
        odo.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        odo.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        odo.top = 105
        // content
        odo.text = "累计里程:0km"
        odo.fontSize = "11px";
        odo.color = '#ffffff'
        odo.fontWeight = "bold"
        panel.addControl(odo);

        const time = new GUI.TextBlock();
        // position
        time.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        time.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        time.top = 120
        // content
        time.text = "运行时间:0h"
        time.fontSize = "11px";
        time.color = '#ffffff'
        time.fontWeight = "bold"
        panel.addControl(time);

        const totalTime = new GUI.TextBlock();
        // position
        totalTime.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        totalTime.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        totalTime.top = 135
        // content
        totalTime.text = "累计时间:0h"
        totalTime.fontSize = "11px";
        totalTime.color = '#ffffff'
        totalTime.fontWeight = "bold"
        panel.addControl(totalTime);

        const voltage = new GUI.TextBlock();
        voltage.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        voltage.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        voltage.top = 150
        voltage.text = "电池电压:0V"
        voltage.fontSize = "11px";
        voltage.color = '#ffffff'
        voltage.fontWeight = "bold"
        panel.addControl(voltage);

        const current = new GUI.TextBlock();
        current.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        current.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        current.top = 165
        current.text = "电池电流:0A"
        current.fontSize = "11px";
        current.color = '#ffffff'
        current.fontWeight = "bold"
        panel.addControl(current);


        const confidence = new GUI.TextBlock();
        confidence.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        confidence.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        confidence.top = 180
        confidence.text = "置信度:0"
        confidence.fontSize = "11px";
        confidence.color = '#ffffff'
        confidence.fontWeight = "bold"
        panel.addControl(confidence);

        const emergency = new GUI.TextBlock();
        emergency.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        emergency.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        emergency.top = 195
        emergency.text = "EMO状态:关闭"
        emergency.fontSize = "11px";
        emergency.color = '#ffffff'
        emergency.fontWeight = "bold"
        panel.addControl(emergency);

        const blocked = new GUI.TextBlock();
        blocked.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        blocked.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        blocked.top = 210
        blocked.text = "阻挡状态:否"
        blocked.fontSize = "11px";
        blocked.color = '#ffffff'
        blocked.fontWeight = "bold"
        panel.addControl(blocked);

        const diStatus = new GUI.TextBlock();
        diStatus.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        diStatus.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        diStatus.top = 230
        diStatus.text = `DI:\n🔴🔴🔴🔴🔴\n🔴🔴🔴🔴`
        diStatus.fontSize = "11px";
        diStatus.color = '#ffffff'
        diStatus.fontWeight = "bold"
        panel.addControl(diStatus);

        const doStatus = new GUI.TextBlock();
        doStatus.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        doStatus.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        doStatus.top = 270
        doStatus.text = `DO:\n🔴🔴🔴🔴🔴\n🔴🔴🔴🔴🔴`
        doStatus.fontSize = "11px";
        doStatus.color = '#ffffff'
        doStatus.fontWeight = "bold"
        panel.addControl(doStatus);

        const taskStatus = new GUI.TextBlock();
        taskStatus.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        taskStatus.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        taskStatus.top = 315
        taskStatus.text = `任务状态:NONE`
        taskStatus.fontSize = "11px";
        taskStatus.color = '#ffffff'
        taskStatus.fontWeight = "bold"
        panel.addControl(taskStatus);

        const taskType = new GUI.TextBlock();
        taskType.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        taskType.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        taskType.top = 330
        taskType.text = `导航类型:没有导航`
        taskType.fontSize = "11px";
        taskType.color = '#ffffff'
        taskType.fontWeight = "bold"
        panel.addControl(taskType);

        const currentLock = new GUI.TextBlock();
        currentLock.textHorizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
        currentLock.textVerticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
        currentLock.top = 345
        currentLock.text = `控制权:\n\t控制者:unknown\n\t锁定IP:0.0.0.0`;
        currentLock.fontSize = "11px";
        currentLock.color = '#ffffff'
        currentLock.fontWeight = "bold"
        panel.addControl(currentLock);
        // 默认将panel设置不可见,后面在修改
        panel.isVisible = false

        return {
            panel,
            batteryCycle,
            batteryTemp,
            controllerTemp,
            controllerHumi,
            controllerVoltage,
            todayOdo,
            odo,
            time,
            totalTime,
            voltage,
            current,
            confidence,
            emergency,
            blocked,
            diStatus,
            doStatus,
            taskStatus,
            taskType,
            currentLock
        }


    }

    private registerInfoPanelEvent() {
        EE.on('togglePanel', () => {
            this.panelInfo.panel.isVisible = !this.panelInfo.panel.isVisible
        })
    }

    public changeInfoPanel(params: TBatteryInfo) {
        (this.panelInfo.batteryCycle as GUI.TextBlock).text = `电池循环:${params.batteryCycle}次`;
        (this.panelInfo.batteryTemp as GUI.TextBlock).text = `电池温度:${(params.batteryTemp).toFixed(2)}℃`;

        (this.panelInfo.controllerTemp as GUI.TextBlock).text = `控制器温度:${(params.controllerTemp).toFixed(2)}℃`;
        (this.panelInfo.controllerHumi as GUI.TextBlock).text = `控制器湿度:${(params.controllerHumi).toFixed(2)}%`;
        (this.panelInfo.controllerVoltage as GUI.TextBlock).text = `控制器电压:${(params.controllerVoltage).toFixed(2)}V`;

        (this.panelInfo.todayOdo as GUI.TextBlock).text = `今日里程:${(params.todayOdo * 0.001).toFixed(2)}km`;
        (this.panelInfo.time as GUI.TextBlock).text = `运行时间:${(params.time * 0.001 / 60 / 60).toFixed(2)}h`;
        (this.panelInfo.totalTime as GUI.TextBlock).text = `累计时间:${(params.totalTime * 0.001 / 60 / 60).toFixed(2)}h`;

        (this.panelInfo.voltage as GUI.TextBlock).text = `电池电压:${(params.voltage).toFixed(2)}V`;
        (this.panelInfo.current as GUI.TextBlock).text = `电池电流:${(params.current).toFixed(2)}A`;


        if (params.confidence > 0.8) {
            (this.panelInfo.confidence as GUI.TextBlock).color = `#fff`;
        } else {
            (this.panelInfo.confidence as GUI.TextBlock).color = `#ff0000`;
        }
        (this.panelInfo.confidence as GUI.TextBlock).text = `置信度:${(params.confidence).toFixed(2)}`;


        if (params.emergency) {
            (this.panelInfo.emergency as GUI.TextBlock).text = `EMO状态:开启`;
        } else {
            (this.panelInfo.emergency as GUI.TextBlock).text = `EMO状态:关闭`;
        }

        if (params.blocked) {
            (this.panelInfo.blocked as GUI.TextBlock).text = `阻挡状态:是`;
            (this.panelInfo.blocked as GUI.TextBlock).color = `#ff0000`;
        } else {
            (this.panelInfo.blocked as GUI.TextBlock).text = `阻挡状态:否`;
            (this.panelInfo.blocked as GUI.TextBlock).color = `#ffffff`;
        }

        // 处理DI的状态
        let diStatus = []
        // 🟢:  在线     🔴: 离线
        for (let d of params.diStatus) {
            if (d.status) {
                diStatus.push("🟢")
            } else {
                diStatus.push("🔴")
            }
        }
        diStatus.splice(Math.ceil(params.diStatus.length * 0.5), 0, '\n');
        (this.panelInfo.diStatus as GUI.TextBlock).text = `DI:\n${diStatus.join('')}`;



        // 处理DO的状态
        let doStatus = []
        // 🟢:  on     🔴: off
        for (let d of params.doStatus) {
            if (d.status) {
                doStatus.push("🟢")
            } else {
                doStatus.push("🔴")
            }
        }
        doStatus.splice(Math.ceil(params.diStatus.length * 0.5), 0, '\n');
        (this.panelInfo.doStatus as GUI.TextBlock).text = `DO:\n${doStatus.join('')}`;


        // task status
        // 0 = NONE, 1 = WAITING(目前不可能出现该状态), 2 = RUNNING, 3 = SUSPENDED, 4 = COMPLETED, 5 = FAILED, 6 = CANCELED
        if (params.taskStatus === 0) {
            (this.panelInfo.taskStatus as GUI.TextBlock).text = `任务状态:NONE`;
        } else if (params.taskStatus === 2) {
            (this.panelInfo.taskStatus as GUI.TextBlock).text = `任务状态:RUNNING`;
        } else if (params.taskStatus === 3) {
            (this.panelInfo.taskStatus as GUI.TextBlock).text = `任务状态:SUSPENDED`;
        } else if (params.taskStatus === 4) {
            (this.panelInfo.taskStatus as GUI.TextBlock).text = `任务状态:COMPLETED`;
        } else if (params.taskStatus === 5) {
            (this.panelInfo.taskStatus as GUI.TextBlock).text = `任务状态:FAILED`;
        } else if (params.taskStatus === 6) {
            (this.panelInfo.taskStatus as GUI.TextBlock).text = `任务状态:CANCELED`;
        }


        // 导航类型, 0 = 没有导航, 1 = 自由导航到任意点, 2 = 自由导航到站点, 3 = 路径导航到站点, 7 = 平动转动, 100 = 其他
        if (params.taskType === 0) {
            (this.panelInfo.taskType as GUI.TextBlock).text = `导航类型:没有导航`;
        } else if (params.taskType === 1) {
            (this.panelInfo.taskType as GUI.TextBlock).text = `导航类型:自由到任意点`;
        } else if (params.taskType === 2) {
            (this.panelInfo.taskType as GUI.TextBlock).text = `导航类型:自由到站点`;
        } else if (params.taskType === 3) {
            (this.panelInfo.taskType as GUI.TextBlock).text = `导航类型:路径到站点`;
        } else if (params.taskType === 7) {
            (this.panelInfo.taskType as GUI.TextBlock).text = `导航类型:平动转动`;
        } else if (params.taskType === 100) {
            (this.panelInfo.taskType as GUI.TextBlock).text = `导航类型:其他`;
        }


        (this.panelInfo.currentLock as GUI.TextBlock).text = `控制权:\n\t控制者:${params.currentLock.nick_name}\n\t锁定IP:${params.currentLock.ip}`;



    }





}





